import React from 'react';
import {connect} from 'dva';
import PropTypes from 'prop-types';
import {Row,Col,Layout,Input} from 'antd';
// import style from '../../styles/TableCss.less';
// import {Link} from 'dva/router'
// import reqwest from 'reqwest';
import {reqwest_post} from '../utils/Reqwest.js'
// import InStyle from '../../styles/Info.less'
// import SalerDirector from './SalerDirector.js'
const {  Content, Footer } = Layout;
// const { RangePicker } = DatePicker;
class EditableCell extends React.Component {
  state = {
    value: this.props.value,
    editable: this.props.editable || false,
  }
  componentWillMount(){
  	// console.log(this.props)
  }
  componentWillReceiveProps(nextProps) {
    // console.log(111)
    // console.log(nextProps.status)
    // console.log(this.props.status)
    let _this=this;
    let cacheValue
    if (nextProps.editable !== _this.state.editable) {
      _this.setState({ editable: nextProps.editable });
      if (nextProps.editable) {
        cacheValue = _this.state.value;
      }
    }
    // if (nextProps.status && nextProps.status !== _this.props.status ) {
    //   if (nextProps.status === 'save') {
    //     console.log(100000)
    //     _this.props.onHandle(_this.state.value);
    //   } else if (nextProps.status === 'cancel') {
    //     _this.setState({ value: cacheValue });
    //     _this.props.onHandle(cacheValue);
    //   }
    // }
  }
  shouldComponentUpdate(nextProps, nextState) {
    return nextProps.editable !== this.state.editable ||
           nextState.value !== this.state.value;
  }
  handleChange(e) {
    // console.log(e)
    const value = e.target.value;
    // console.log(value)
    this.setState({ value });
  }
  render() {
    // console.log(this.props )
    const { value, editable } = this.state;
    return (
      <div>
        {
          editable ?
            <div>
              <Input
                value={value}
                style={{width:90,height:20}}
                onChange={e => {this.props.onA(e);this.handleChange(e)}}
              />
            </div>
            :
            <div className="editable-row-text">
              {value!=null?value.toString() || ' ':undefined}
            </div>
        }
      </div>
    );
  }
}

export default connect()(EditableCell);